<template>
	<gui-page ref="guipage">
	<view slot="gBody" class="" style="">
		<image src="http://boyaltd.oss-cn-hangzhou.aliyuncs.com/2022-09/29/dRcmwphpxVffZM1664446616220929.png"
		style="height: 100%;width: 100%;position: absolute;"></image>
		
		<view class="heard gui-padding gui-color-white" style="margin-top: 30rpx;height: 160rpx;width: 80%;padding-top: 60rpx;position: relative;">
			<text class="gui-h2" style="margin-top: 40rpx;">集团公司领导信箱</text>
			<view class="" style="margin-top: 10rpx;">
				<text style="font-size: 20rpx;">LIUZHOU STEEL GROUP LEADER'S MAILBOX</text>
			</view>
		</view>
		
		<view class="" style="position: relative;">
			<view class="gui-bg-white" style="width: 80%;margin: 40rpx auto 0 auto;border-radius: 40rpx;padding: 20rpx;word-wrap: break-word;">
				<view class="">
					<text>问题 : </text>
				</view>
				<text>{{show_data.content}}</text>
			</view>
			
			<view class="gui-bg-white" style="width: 80%;margin: 20rpx auto 0 auto;border-radius: 40rpx;padding: 20rpx;word-wrap: break-word;">
				<view class="">
					<text>审批流 : </text>
				</view>
				<view :class="item.is_approver == '1' ? 'bor_r gui-margin-top gui-flex gui-padding' : 'gui-margin-top gui-flex gui-padding'" v-for="(item,index) in show_data.process" :key="index">
					<text style="width: 80%;">{{item.approver_name}} : {{item.approver_opinion}}</text>
					<view style="width: 20%;text-align: right;">
						<text class="gui-color-red">{{item.approver_status == "1" ? "已审核" : "待审"}}</text>
					</view>
				</view>
			</view>
			
			
			<view class="gui-bg-white" style="width: 80%;margin: 20rpx auto 0 auto;border-radius: 40rpx;padding: 20rpx;word-wrap: break-word;" v-if="">
				<view class="">
					<text>审核意见 : </text>
				</view>
				<input v-model="opinion" type="text" class="gui-form-input" style="border: #acacac solid 1rpx;border-radius: 2rpx;">
				<view class="" v-if="is_reply">
					<text>回复 : </text>
					<textarea v-model="reply" name="" id="" placeholder="请输入回复内容" style="width: 96%;border-radius: 20rpx;height: 200rpx;padding: 2%;border: #acacac solid 1rpx;"></textarea>
				</view>
			</view>
			
			
			<view class="">
				<view class="" style="padding-top: 20rpx;">
					<radio-group @change="radioChange" style="display: flex;">
						<label class="" v-for="(item, index) in items" :key="item.value" style="margin-left: 30rpx;">
							<radio :value="item.value" :checked="index === current" />
							<text>{{item.name}}</text>
						</label>
					</radio-group>
				</view>
			</view>
			<view class="gui-padding-x" style="padding: 0rpx 20%;">
				<button type="default" class="gui-bg-green gui-box-shadow gui-margin" @tap="sh">确认审核</button>
			    <button type="default" class="gui-bg-gray  gui-box-shadow gui-margin" @tap="back">返回列表</button>
			</view>
			
			<view class="gui-padding">
				<view class="">
					<text>图片 : </text>
				</view>
				<view class="gui-flex">
					<view @tap="show_img(item)" v-for="(item,index) in show_data.imgs.split(',')" class="" style="width: 100rpx;height: 100rpx;border-radius: 20rpx;" :key="index">
						<image :src="item" mode=""></image>
					</view>
				</view>
			</view>
		</view>

		
		<!-- 遮盖层 -->
		<view class="">
			<gui-page-loading ref="guipageloading"></gui-page-loading>
		</view>
	</view>
	</gui-page>
</template>
<script>
export default {
	data() {
		return {
			user:[],
			id:0,
			show_data:{
				'imgs':''
			},
            items: [{
                    value: '1',
                    name: '通过',
                    checked: 'true'
                },{
                    value: '0',
                    name: '不通过',
                },
            ],
            current: 0,
			opinion:'',//意见
			is_reply:0,//是否回复
			reply:'',//回复
			
		}
	},
	// destroyed(){
	// 	console.log('114455');
	// },
	onLoad : function (option) {
		this.user=uni.getStorageSync("userInfo");
		console.log(this.user);
		// this.id = option.id;
		console.log("option:",option)
		this.id = option.id
		this.get_detail()
	},
	onReady() {
		// this.real_login();
		// if(this.id){
		// 	this.get_detail(this.id);
		// }else{
		// 	uni.showModal({
		// 		title:'提示',content:'数据缺失'
		// 	});
		// }
	},
	methods:{
		sh(){
			let self = this;
			uni.showModal({
				title:'提示',content:'是否确认审核?',success(res) {
					if(res.confirm){
						self.sh_post();
					}
				}
			})
		},
		sh_post(){
			let self = this;
			// self.$refs.guipageloading.open();
			// self.grace.post(self.apiUrl+"/mailbox/sh",{opinion:this.opinion,reply:this.reply,mail_id:this.id,is_tg:this.items[this.current].value},function(res){
				self.$boya.Post("/api/mailbox/sh",{opinion:self.opinion,reply:self.reply,mail_id:self.id,is_tg:self.items[self.current].value},function(res){
				console.log(res,'res');
				if(res.code == 200){
					uni.showModal({
						title:'提示',content:'审核成功',success() {
							uni.reLaunch({
								url:'./mail_index'
							});
						}
					})
				}
				else{
					uni.showModal({
						title:'提示',
						content:res.data
					});
				}
			});
		},
		get_detail(id){
			//详情
			let self = this;
			// this.$refs.guipageloading.open();
			console.log("getDea",self.id)
			// this.grace.post(self.apiUrl+"/mailbox/get_sh_detail",{id:id},function(res){
				self.$boya.Post("/api/mailbox/get_sh_detail",{id:self.id},function(res){
				// self.$refs.guipageloading.close();
				if(res.code == 200){
					self.is_detail = 1;
					self.show_data = res.data.detail;
					self.is_reply = res.data.is_reply;
					self.opinion = res.data.defult_op;
					self.reply = res.data.reply
					console.log("reply",self.reply)
				}
				else{
					uni.showModal({
						title:'提示',
						content:res.data
					});
				}
			});
		},
        radioChange: function(evt) {
            for (let i = 0; i < this.items.length; i++) {
                if (this.items[i].value === evt.detail.value) {
                    this.current = i;
                    break;
                }
            }
        },
		show_img(url){
			uni.previewImage({
				urls:[url],
				index:0
			});
		},
		back(){
			uni.reLaunch({
				url:'/mial_index'
			});
		},
	}
}
</script>

<style>
	page{
		height: 100%;
		background: url('http://boyaltd.oss-cn-hangzhou.aliyuncs.com/2022-09/29/dRcmwphpxVffZM1664446616220929.png') 100% 100%/100% 100%;
		/* background: linear-gradient(0deg, rgba(237, 250, 250, 1) 0%, rgba(3, 29, 135, 1) 100%); */
	}
	.heard{
		background: url('https://img.js.design/assets/img/6332548debef9722cf5b62f9.png');
		background-size: 200rpx;
		background-repeat: no-repeat;
		background-position: right;
	}
	.this_bg{
		background-color: rgba(255, 141, 26, 1);
	}
	.defu_bg{
		background-color: rgba(29, 53, 148, 1);
	}
	.bor_r{
		border:red solid 1rpx;
	}
</style>
<style scoped>
	
</style>